<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>织蝶云 - OA+PM+CRM一站式企业应用管理平台</title>
    <%- include('./system_layouts/aside.ejs')%>
</head>

<body>
    <div class="left_nav">
        <div class="logo">
            <a href="javascript:;">
                <img src="./images/lyd/lyd_approval_frame_logo-left.png" alt="织蝶云">
            </a>
        </div>
        <%-include('./system_layouts/footer.ejs')%>
    </div>
    <!-- <div class="top_nav_box"> -->
    <%-include('./system_layouts/nav.ejs')%>
    <div class="add">
        <div class="content">
            <nav class="navbar navbar-expand-lg navbar-light  nav_content">
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <div class="navbar-nav mr-auto">
                        <a href="javascript:;" class="btn data_btn buling" id="qb">全部员工</a>
                        <a href="javascript:;" class="btn data_btn btn-data" id="zc">正常员工</a>
                        <a href="javascript:;" class="btn data_btn" id="jy">禁用员工</a>
                        <a href="javascript:;" class="btn data_btn" id='hs'>回收站</a>
                    </div>
                    <form class="form-inline my-2 my-lg-0 btn_mar">
                        <select name="states" id="" class="from_select">
                            <option value="(1,2)">员工状态</option>
                            <option value="(1)">正常</option>
                            <option value="(2)">禁用</option>
                        </select>
                        <input class="mr-sm-2 screen-input" type="search" name="iconname" placeholder="请输入姓名"
                            aria-label="Search">
                        <button type="button" class="btn btn-success" id="screen">
                            <i class="iconfont icon-search"></i>
                            筛选</button>
                        <button type="button" class="btn btn-danger hshs">
                            <i class="iconfont icon-plus"></i>
                            添加新员工</button>
                    </form>
                </div>
            </nav>
            <!-- 展示的内容 -->

            <!-- 正常员工 -->
            <!-- 禁用员工 -->
            <!-- 回收站 -->
        </div>
        <div class="wrapper">
            <div class="row">
                <div class="col-sm-12">
                    <section class="panel">
                        <div class="panel-body">
                            <section id="unseen">
                                <form id="user-form-list">
                                    <table class="table table-bordered table-invoice">
                                        <thead>
                                            <tr>
                                                <th>用户名</th>
                                                <th>姓名</th>
                                                <th>性别</th>
                                                <th>职称</th>
                                                <th>部门</th>
                                                <th>权组</th>
                                                <th>上次登录</th>
                                                <th>状态</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody id="tbody-y">


                                        </tbody>

                                    </table>
                                </form>
                            </section>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
    <footer class="foote"> 2020 &copy; by 织蝶云系统 &middot; <a href="http://doc.zhidieyun.com" target="_blank">织蝶云手册</a>
        &middot; <a href="https://www.zhidieyun.com" target="_blank">翌羽信息科技(上海)有限公司 版权所有</a></footer>
    </div>


    <%-include('./system_layouts/header.ejs')%>
    <script src="./lib/layDate-v5.0.9/laydate/laydate.js"></script>

    <!-- 全部员工 -->
    <script type="text/template" id='qbyg'>
        <div class="page-count-box">共<span>{{list.length}}</span>条</div>
        {{each list}}
        <tr>
                <td>{{$value.username}}</td>
                <td class="hidden-xs"><a href="/user/show/1551544561346862996">{{$value.name}}</a></td>
                <td class="hidden-xs">{{$value.sex}}</td>
                <td class="hidden-xs">{{$value.title}}</td>
                <td class="hidden-xs">{{$value.department}}</td>
                <td class="hidden-xs">{{$value.rightgroup}}</td>
                <td class="hidden-xs">{{$value.lastlogin}}</td>
                {{if $value.states == '正常'}}
                <td><span class="badge badge-success">{{$value.states}}</span></td>
                {{else}}
                <td><span class="badge">{{$value.states}}</span></td>
                {{/if}}
                <td>
                    <a href="javascript:;" title="编辑"
                        class="btn btn-primary btn-xs" id="updatauser" data-id="{{$value.id}}"><i
                            class="fa fa-pencil-square-o" ></i> 编辑</a>
                {{if $value.states == '正常'}}
                    <a href="javascript:;" 
                        data-status="2" title="禁用"
                        class="js-user-single btn btn-warning btn-xs" id='userjy' data-id="{{$value.id}}">禁用</a>
                {{else}}
                <a href="javascript:;" 
                data-status="2" title="禁用"
                class="js-user-single btn btn-success btn-xs" id='userjy' data-id="{{$value.id}}">正常</a>
                {{/if}}
                {{if $value.isDel == 'false'}}
                    <a href="javascript:;" title="删除"class="btn btn-danger btn-xs js-user-delete" id='deluser' data-id="{{$value.id}}"><i class="fa fa-trash-o"></i>
                        删除</a>
                {{else}}  
                    <a href="javascript:;" title="删除"class="btn btn-success btn-xs js-user-delete" id='reduction' data-id="{{$value.id}}"><i class="fa fa-trash-o"></i>
                    还原</a>
                {{/if}}
                </td>

            </tr>
        {{/each}}
                   
    </script>
    <script type='text/template' id='signin'>
        <div class="col-md-4">
                <form id="users-add">
                  <h2>添加新用户</h2>
                  <a class="btn btn-success btn-sm del-more" href="/yyl_system">返回</a>
                  <div class="form-groupa">
                    <label for="email">用户名:</label>
                    <input id="email"   class="inputsize" name="username" type="text" placeholder="用户名">
                  </div>
                  <div class="form-groupa">
                    <label for="slug">姓名:</label>
                    <input id="slug"   class="inputsize" name="name" type="text" placeholder="姓名">
                  </div>
                  <div class="form-groupa">
                    <label for="nickname">性别:</label>
                    <!-- <input id="nickname"   class="inputsize" name="sex" type="text" placeholder="性别"> -->
                    <select name="sex" id="nickname select-a" class="inputsize">
                        <option value="1">男</option>
                        <option value="2">女</option>
                    </select>
                  </div>
                  <div class="form-groupa">
                    <label for="password">职称:</label>
                    <input id="password"   class="inputsize" name="title" type="text" placeholder="职称">
                  </div>
                  <div class="form-groupa">
                  <label for="password">部门:</label>
                  <input id="password"   class="inputsize" name="department" type="text" placeholder="部门">
                  </div>
                  <div class="form-groupa">
                  <label for="password">权组:</label>
                  <input id="password"   class="inputsize" name="rightgroup" type="text" placeholder="权组">
                  </div>
                  <div class="form-groupa">
                  <label for="password">上次登录:</label>
                  <input id="password" class="inputsize test1" name="lastlogin" type="text" placeholder="上次登录">
                  </div>
                  <div class="form-groupa" name ='states'>
                  <label for="password">状态:</label>
                  <select id="select-a" name ='states'>
                      <option value="1">正常</option>
                      <option value="2">禁用</option>
                  </select>
                  </div>
                  <div class="form-groupa">
                    <!-- <button class="btn btn-primary" type="submit">添加</button> -->
                    <a href="javascript:;" class="btn btn-primary btn-add">添加</a>
                  </div>
                </form>
              </div>
    </script>

    <script>
        $(document).ready(function () {
            let show = function () {
                // 渲染页面
                $.ajax({
                    type: 'get',
                    url: '/yyl_system_qbyg',
                    data: '',
                    success: function (data) {
                        // console.log(data);
                        let str = template('qbyg', { list: data });

                        // console.log(str);
                        $('#tbody-y').html(str);
                        // console.log($('#tbody-y'));
                    }
                })
            }
            show();
            // 查看全部用户
            $('.buling').click(function () {
                show();
            });
            // 查看正常用户
            $('.btn-data').click(function () {
                // console.log(1)
                $.ajax({
                    type: 'get',
                    url: '/yyl_system_zcyg',
                    data: '',
                    success: function (data) {
                        let zcstr = template('qbyg', { list: data });
                        // console.log(zcstr)
                        $('#tbody-y').html(zcstr);
                    }
                })
            });
            $('.hshs').click(function () {
                //   $.ajax({
                //       type:'get',
                //       url:'/signin',
                //       data:'',
                //       success:function(data){
                let sign = template('signin');
                $('.add').html(sign);
                //       }
                //   })
            });
            $('.del-more').click(function () {
                show();
            })
            // $('.btn-primary').click(function(){
            // 添加用户
            $('body').on('click', '.btn-add', function () {
                // $('.from_select').val = 2;
                let formdata = $('#users-add').serialize();
                if ($('#users-add input').val()=='') {
                    alert('不能为空！');
                    return
                } else {
                    $.ajax({
                        type: 'post',
                        url: '/useradda',
                        data: formdata,
                        success: function (data) {
                            if (data.code == '100') {
                                alert(data.msg);
                                // location.href='./yyl_system';
                                show();
                            }
                        }
                    })
                }
            });
            // 渲染回收站
            let fdzz = function () {
                $.ajax({
                    type: 'get',
                    url: '/deleteusera',
                    data: '',
                    success: function (data) {
                        let hsstr = template('qbyg', { list: data });
                        // console.log(zcstr);
                        $('#tbody-y').html(hsstr);
                    }
                })
            }
            // 回收站显示
            $('#hs').click(function () {
                // console.log(1);
                fdzz();
            })
            // 数据放到回收站
            $('table').on('click', '#deluser', function () {
                let dataid = $(this).data('id');
                console.log(dataid);
                $.ajax({
                    type: 'get',
                    url: '/deleteusers',
                    data: { dataid: dataid },
                    beforeSend: function () {
                        let flag = confirm('您确定要将该用户放入回收站吗？');
                        if (!flag) {
                            return false;
                        }
                    },
                    success: function (data) {
                        // console.log(data);
                        if (data.code == '101') {
                            alert(data.msg);
                            show();
                        }
                    }
                })
            })

            // 回收站还原
            $('table').on('click', '#reduction', function () {
                let dataid = $(this).data('id');
                console.log(dataid);
                $.ajax({
                    type: 'get',
                    url: '/reduction',
                    data: { dataid: dataid },
                    beforeSend: function () {
                        let flag = confirm('您确定要还原吗？');
                        if (!flag) {
                            return false;
                        }
                    },
                    success: function (data) {
                        fdzz();
                    }
                })
            })
            // 信息回显
            // $('table').on('click', '#updatauser', function () {
            //     let userId = $(this).data('id');
            //     console.log(userId);
            //     // 请求方式: get(获取数据) post(发送数据) delete(删除数据) put(更新数据) 
            //     $.ajax({
            //         type: 'get',
            //         url: '/userFind',
            //         data: {
            //             id: userId
            //         },
            //         success: function (data) {
            //             console.log(data);
            //             let infoHtml = template('signina', data[0]);
            //             // console.log(infoHtml);
            //             $('.add').html(infoHtml);
            //         }
            //     })
            // })
            // // 更改数据
            // $('table').on('click', '.btn-update', function () {
            //     console.log(12334);
            //     let formdata = $('.col-md-5 #users-add').serialize();
            //     // console.log(formdata);
            //     let userId = $(this).data('id');
            //     // console.log(userId);
            //     $.ajax({
            //         type: 'post',
            //         url: '/userUpdate',
            //         data: formdata + '&id=' + userId,
            //         success: function (data) {
            //             // console.log(data);
            //             if (data.code == '102') {
            //                 alert(data.message);
            //                 show();
            //             }
            //         }
            //     })
            // })
            // 查询用户
            $('.content .btn_mar').on('click', '#screen', function () {
                // console.log(123);
                let datas = $('.btn_mar').serialize();
                console.log(datas);
                $.ajax({
                    type: 'get',
                    url: '/userechoa',
                    data: datas,
                    success: function (data) {
                        console.log(data);
                        let strdata = template('qbyg', {
                            list: data
                        });
                        // console.log(strdata);
                        $('#tbody-y').html(strdata);
                    }

                })
            })
            //   禁用员工
            $('#jy').click(function () {
                $.ajax({
                    type: 'get',
                    url: '/yyl_system_jyyg',
                    data: '',
                    success: function (data) {
                        let zcstr = template('qbyg', { list: data });
                        // console.log(zcstr)
                        $('#tbody-y').html(zcstr);
                    }
                })
                // 点击按钮禁用员工

            })
            $('table').on('click', '#userjy', function () {
                // $('#userjy').click(function () {
                let userId = $(this).data('id');
                $.ajax({
                    type: 'get',
                    url: '/jyuser',
                    data: {
                        id: userId,
                        isJin: $(this).html()
                    },
                    success: function (data) {
                        // console.log(data);
                        if (data.code == '103') {
                            alert(data.msg);
                            // show();
                            location.href = '/yyl_system';
                        }
                    }
                })
                laydate.render({
                    elem: '.test1'
                })
                laydate.render({
                    elem: '.test2'
                })
            })
        })

    </script>
</body>

</html>